<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" width="80%" destroy-on-close @closed="$emit('closed')" align-center>
        <el-form :model="form" :rules="rules" :disabled="mode == 'show'" ref="dialogForm" label-width="90px" label-position="right">
            <el-row :gutter="1">
                <el-col :span="8">
                    <el-form-item label="承制人">
                        <el-input v-model="info.referred_as"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="发缝合同号">
                        <el-input v-model="info.contract_no" v-if="contractShow"></el-input>
                        <el-select v-model="form.contract_no" clearable style="width: 100%" placeholder="请选择" v-else @change="conChange">
                            <el-option v-for="item in contractList" :key="item.id" :label="item.contract_no" :value="item.id" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="工厂货号">
                        <el-input v-model="info.factory_number"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="1">
                <el-col :span="8">
                    <el-form-item label="批次号">
                       <el-input v-model="info.batch_number"></el-input>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="工序">
                        <el-select v-model="form.two_process_id" clearable style="width: 100%" placeholder="请选择" @change="processChange">
                            <el-option v-for="item in twoProcess" :key="item.id" :label="item.title" :value="item.id" />
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="8">
                    <el-form-item label="收货日期" prop="take_deliver_date">
                        <el-date-picker v-model="form.take_deliver_date" :value-format="'YYYY-MM-DD'" type="data" placeholder="请选择收货日期" style="width: 100%" />
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="1">
                <el-col :span="8">
                    <el-form-item label="备注" prop="remark">
                        <el-input v-model="form.remark" placeholder="请输入备注"></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-container>
                <el-col :span="16">
                    <div style="text-align: center;margin: 10px;">发缝资料</div>
                    <sc-form-table ref="table" v-model="form.size_data" :addTemplate="material" placeholder="暂无数据" hideAdd hideDelete height="400">
                        <el-table-column label="颜色" prop="colour" align="center"></el-table-column>
                        <el-table-column label="批次号" prop="batch_number" align="center"></el-table-column>
                        <el-table-column label="尺码" prop="goods_size" align="center"></el-table-column>
                        <el-table-column label="可收数" prop="can_take_num" align="center"></el-table-column>
                        <el-table-column label="此次收货数量" prop="num" align="center">
                            <template #default="scope">
                                <el-input v-model="scope.row.num" placeholder="请输入此次收货数量"></el-input>
                            </template>
                        </el-table-column>
                    </sc-form-table>
                </el-col>
            </el-container>
        </el-form>
        <el-footer>
            <div style="display:flex;justify-content: end;">
                <el-button @click="visible = false">取 消</el-button>
                <el-button v-if="mode != 'show'" type="primary" :loading="isSaveing" @click="submit()">保 存</el-button>
            </div>
        </el-footer>
	</el-dialog>
</template>

<script>
    export default {
        emits: ['success', 'closed'],
        data() {
            return {
                mode: "add",
                titleMap: {
                    add: '手动录入',
                    edit: '编辑仓库',
                    show: '查看'
                },
                visible: false,
                isSaveing: false,
                //表单数据
                form: {
                    remark:"",
                    take_deliver_date: new Date().toISOString().slice(0, 10),
                    size_data:[],
                    process_id: 4,
                    contract_no:"",
                    two_process_id:""
                },
                info:{
                    qrcode:"",
                    referred_as: "",
                    contract_no: "",
                    factory_number: "",
                    batch_number: "",
                    produce_process_name: "",
                    weight:"",
                    expected_number:"",
                    weight_num:12,
                    edit_number:12,
                },
                weight:"",
                twoProcess:[],
                checkTitle:"",
                contractShow:false,
                contractList:[],
            }
        },
        methods: {
            //显示
            open(mode = 'add') {
                this.mode = mode;
                this.visible = true;
                return this
            },
            //表单提交方法
            submit() {
                this.$refs.dialogForm.validate(async (valid) => {
                    if (valid) {
                        this.isSaveing = true;
                        var res = [];
                        res = await this.$API.produce.sewInput.post(this.form);
                        this.isSaveing = false;
                        if (res.code == 1) {
                            this.$emit('success', this.form, this.mode)
                            this.visible = false;
                            this.$message.success("操作成功")
                        } else {
                            this.$alert(res.message, "提示", { type: 'error' })
                        }
                    } else {
                        return false;
                    }
                })
            },
            //表单注入数据
            async setData(data) {
                let array = []
                if(data==undefined){
                    this.contractShow = false
                    var res = await this.$API.produce.proAll.get({process_id:4});
                    this.contractList = res.data
                }else{
                    this.contractShow = true
                    data.orderDetail.map(item=>{
                        array.push({
                            colour:item.colour,
                            batch_number:data.batch_number,
                            goods_size:item.goods_size,
                            can_take_num:item.can_take_num,
                            dozen_weight:item.dozen_weight,
                            weight:item.weight,
                            contract_no:item.contract_no,
                            total_weight:item.total_weight,
                            goods_id:item.goods_id
                        })
                    })
                    this.twoProcess = data.sub_process;
                    this.form.size_data = array
                    this.info.referred_as = data.referred_as
                    this.info.contract_no = data.contract_no
                    this.info.factory_number = data.factory_number
                    this.info.batch_number = data.batch_number
                }
            },
            async conChange(e){
                this.contractList.map(item=>{
                    if(e==item.id){
                        this.info.referred_as = item.referred_as
                        this.info.contract_no = item.contract_no
                        this.form.contract_no = item.contract_no
                        this.info.factory_number = item.factory_number
                        this.info.batch_number = item.batch_number
                    }
                })
                var res = await this.$API.produce.proDetail.get({contract_no:this.info.contract_no});
                let array = []
                res.data.orderDetail.map(item=>{
                    array.push({
                        colour:item.colour,
                        batch_number:this.info.batch_number,
                        goods_size:item.goods_size,
                        can_take_num:item.can_take_num,
                        dozen_weight:item.dozen_weight,
                        weight:item.weight,
                        contract_no:item.contract_no,
                        total_weight:item.total_weight,
                        goods_id:item.goods_id
                    })
                })
                this.form.size_data = array
                this.twoProcess = res.data.sub_process;
            },
            processChange(e){
                this.twoProcess.map(item=>{
                    if(e==item.id){
                        this.info.produce_process_name = item.title
                    }
                })
            },
        }
    }
</script>

<style></style>
